@tailwind base;
@tailwind components;
@tailwind utilities;

@import url("../styles/theme.css");
body {
	font-family: "Inter", sans-serif;
}

@layer utilities {
	.flex-center {
		@apply flex justify-center items-center;
	}

	.flex-between {
		@apply flex justify-between items-center;
	}

	.flex-start {
		@apply flex justify-start items-center;
	}

	.card-wrapper {
		@apply bg-light-900 dark:dark-gradient shadow-light-100 dark:shadow-dark-100;
	}

	.btn {
		@apply bg-light-800 dark:bg-dark-300 !important;
	}

	.btn-secondary {
		@apply bg-light-800 dark:bg-dark-400 !important;
	}

	.btn-tertiary {
		@apply bg-light-700 dark:bg-dark-300 !important;
	}

	/* .markdown {
		@apply max-w-full prose dark:prose-p:text-light-700 dark:prose;
	} */

	.primary-gradient {
		background: linear-gradient(129deg, #ff7000 0%, #e2995f 100%);
	}

	.dark-gradient {
		background: linear-gradient(
			232deg,
			rgba(23, 28, 35, 0.41) 0%,
			rgba(19, 22, 28, 0.7) 100%
		);
	}

	.tab {
		@apply min-h-full dark:bg-dark-400 bg-light-800 text-light-5;
	}

	.no-focus {
		@apply focus-visible:ring-0 focus-visible:ring-transparent focus-visible:outline-none focus:border-none focus-visible:border-none;
	}
}

.shadow-none {
	box-shadow: none !important;
}

.active-theme {
	filter: invert(53%) sepia(98%) saturate(3332%) hue-rotate(0deg)
		brightness(104%) contrast(106%) !important;
	-webkit-filter: invert(53%) sepia(98%) saturate(3332%) hue-rotate(0deg);
}

.light-gradient {
	background: linear-gradient(
		132deg,
		rgba(247, 249, 255, 0.5) 0%,
		rgba(229, 237, 255, 0.25) 100%
	);
}

.primary-text-gradient {
	background: linear-gradient(129deg, #ff7000 0%, #e2995f 100%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.custom-scrollbar::-webkit-scrollbar {
	width: 3px;
	height: 3px;
	border-radius: 2px;
}
.custom-scrollbar::-webkit-scrollbar-track {
	background: #ffffff;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
	background: #888;
	border-radius: 50px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
	background: #555;
}

/* Markdown Start */

.markdown a {
	color: #1da1f2;
}

.markdown a,
code {
	overflow-wrap: break-word;
	word-wrap: break-word;
	-ms-word-break: break-all;
	word-break: break-all;
	word-break: break-word;
	-ms-hyphens: auto;
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
	padding: 2px;
	color: #ff7000 !important;
}

.markdown pre {
	display: grid;
	width: 100%;
}

.markdown pre code {
	width: 100%;
	display: block;
	overflow-x: auto;
	color: inherit !important;
}

/* Markdown End */

/* Clerk */

.cl-internal-b3fm6y {
	background: linear-gradient(129deg, #ff7000 0%, #e2995f 100%);
}

.hash-span {
	margin-top: -140px;
	padding-bottom: 140px;
	display: block;
}

.no-scrollbar::-webkit-scrollbar {
	display: none;
}

.no-scrollbar {
	-ms-overflow-style: none; /* IE and Edge */
	scrollbar-width: none; /* Firefox */
}
